<template>
  <div>
    <a-form-model :model='formState' ref='commonForm' layout='horizontal' v-bind='formItemLayout'>
      <template v-for='(item,index) in formState'>
        <a-form-model-item :name='item.configKey' :label='item.configName' :help='item.remark'>
          <a-input v-model:value='item.configVal' v-if="item.compType=='input'" />
          <a-switch v-model:checked='item.configVal' v-if="item.compType=='switch'" checkedValue='1' unCheckedValue='0' />
        </a-form-model-item>
      </template>
    </a-form-model>
  </div>
</template>
<script>
export default {
  name: "Tab5",
  props: {},
  data() {
    return {
      formItemLayout: {
        labelCol: { span: 3 },
        wrapperCol: { span: 10 }
      },
      formState: {
        configKey: "",
        configVal: "",
        configName: "",
        compType: ""
      }
    }
  },
  methods: {
    getCommonConfig() {
      this.http.get(this, {
        url: this.api.config.getCommonConfig,
        data: {
          configType: "common"
        },
        success: (me, data) => {
          this.formState = data
        }
      })
    },
    setData() {
      this.getCommonConfig()
    },
    handleSubmit() {
      this.$refs["commonForm"].validate(valid => {
        if (valid) {
          this.http.post(this, {
            url: this.api.config.commonConfigSave,
            data: {
              commonConfig: JSON.stringify(this.formState)
            },
            success: function(me) {
            }
          })
        } else {
          return false
        }
      })
    }
  },
  computed: {},
  created() {
    this.getCommonConfig()
  },
  components: {}
}

</script>

